<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/base.css"/>
		<link rel="stylesheet" type="text/css" href="css/detail.css"/>
		<script type="text/javascript" src="JS/detail.js"></script>
		<script type="text/javascript" src="JS/public.js"></script>
		<script src="JS/js/jquery.min.js"></script>
	</head>
	<body>
		<!--导航开始-->
		<div id="Mainav">
			<div class="container">
				<ul class="nav">
					<li>home
						<ul>
							<li><a href="index.html">home1</a></li>
							<li><a href="#">home2</a></li>
							<li><a href="#">home3</a></li>
						</ul>
					</li>
					<li>shop+
						<ul>
							<li><a href="shopcar.html">Shopping Cart</a></li>
							<li><a href="#">Checkout</a></li>
							<li><a href="#">Order</a></li>
						</ul>
					</li>
					<li>About Us</li>
					<li>Contact</li>
				</ul>
				<h1><img src="images/logo.png"/></h1>
				<ul class="nav_right">
					<li><a href="login/login.html">登录</a>/<a href="register/register.html">注册</a></li>
					<li><a href="#" class="car"><img src="images/cart.png"/></a></li>
				</ul>
			</div>
		</div>
		<!--detail开始-->
		<div id="detail" class="container">
			<div id="" class="detail_left">
				<h3>QUICK VIEW</h3>
				<!--<img src="images/collec-1.jpg"/>-->
				
				
			<div id="box" >
					<div id="small">
						<img src="images/collec-1.jpg"/>
						<div id="mask"></div>
					</div>
					<div id="big">
						<img src="images/collec-1.jpg" alt="" id="bigImg" width="100%"/>
					</div>
			</div>
				
				
				
				
				
				
				
				
				
				<ul class="collec">
					<li><a href="javascript:;"><img src="images/collec-1.jpg" width="100%"/></a></li>
					<li><a href="javascript:;"><img src="images/collec-2.jpg" width="100%"/></a></li>
					<li><a href="javascript:;"><img src="images/collec-3.jpg" width="100%"/></a></li>
				</ul>
			</div>
			<div class="detail_right">
				<h3>Queen Rose - Pink</h3>
				<p>It is a long established fact that a reader will be distracted by the readable
					 content of a page when looking at its layout.</p>
				<span>★ ★ ★ ★ ★</span>
				<span>10 Rating(s) | Add Your Rating</span>
				<span class="price">$250.9</span>
				<h4>Option</h4>
				<div id="size">
					<p>Size:</p>
					<ul class="size">
						<li>S
							<ul>
								<li>S</li>
								<li>M</li>
								<li>L</li>
								<li>XL</li>
							</ul>
						</li>
					</ul>
				</div>
				<div id="color">
					<p>Color</p>
					<a href="#"></a>
					<a href="#"></a>
					<a href="#"></a>
					<a href="#"></a>
				</div>
				<ul id="quan" class="quan">
					<li>Quanty:</li>
					<li class="sub">-</li>
					<li><input type="text" name="" id="" value="1" /></li>
					<li class="add">+</li>
					<li class="sum">$250.9</li>
				</ul>
				<a href="shopcar.html" class="addcar">Add to cart</a>
				<a href="#" class="shop_now">shop now</a>
			</div>
		</div>
		<!--footer开始-->
    <div id="mainFooter">
    	<div class="footer container">
    		<dl>
    			<dt>About</dt>
    			<dd><a href="#">ews & Stories</a></dd>
    			<dd><a href="#">History</a></dd>
    			<dd><a href="#">Our Studio</a></dd>
    			<dd><a href="#">Shop</a></dd>
    			<dd><a href="#">Stockists</a></dd>
    		</dl>
    		<dl>
    			<dt>Customer sevices</dt>
    			<dd><a href="#">Contact Us</a></dd>
    			<dd><a href="#">Trade Services</a></dd>
    			<dd><a href="#">Login/Register</a></dd>
    			<dd><a href="#">Delivery & Returns</a></dd>
    			<dd><a href="#">FAQs</a></dd>
    		</dl>
    		<dl>
    			<dt>Store</dt>
    			<dd><a href="#">Shop</a></dd>
    			<dd><a href="#">Wedding</a></dd>
    			<dd><a href="#">Holiday</a></dd>
    		</dl>
    		<div id="footer_right">
    			<h3>Newsletter</h3>
    			<p>Sign up for our mailing list to get lastest updates and offer</p>
    			<input type="text" name="" id="name" value="" placeholder="Your mail here"/>
    			<input type="submit" name="" id="btn" value="Subscribe" />
    		</div>
    		<div id="social">
    			<span>CONNECT WITH US:</span>
	    		<ul class="social">
	    			<li><a href="#"></a></li>
	    			<li><a href="#"></a></li>
	    			<li><a href="#"></a></li>
	    			<li><a href="#"></a></li>
	    		</ul>
    		</div>
    	</div>
    	<div id="copy">
    		<ul class="copy container">
	    		<li><a href="javascript:;"><img src="images/logo.png"/></a></li>
	    		<li>Copyright &copy; 2018 by EngoTheme</li>
	    		<li><a href="#">E: Jenstore@gmail.com</a></li>
    		</ul>
    	</div>
    </div>
	</body>
</html>

